<template>
  <div class="classic_movie_main">
      <ul>
        <li v-for="item in data.list" :key="item.id">
          <img :src="item.img">
          <div class="content">
            <h1>{{item.nm}}</h1>
            <p>{{item.enm}}</p>
            <p>{{item.cat}}</p>
            <p v-show="item.pubDesc">{{item.pubDesc}}</p>
          </div>
          <div class="right_content">
            <span v-show="item.sc!=0" ><span class="gloden">{{item.sc}}</span>分</span>
            <span v-show="item.sc==0">暂无评分</span>
          </div>
        </li>
      </ul>

      <mao-yan-aside></mao-yan-aside>
  </div>
</template>

<script>
import axios from 'axios';
import MaoYanAside from '@/components/MaoYanAside.vue';

export default {
  components: { MaoYanAside },
    name:"ClassicMovie",
    data(){
      return {
        data:{hot:[]}
      }
    },
    created () {
      axios.get("ajax/moreClassicList?sortId=1&showType=3&limit=10&offset=0&optimus_uuid=EC840BF0533D11EC934BF7F85E54B5E26460D93951184003AD406C15B8110050&optimus_risk_level=71&optimus_code=10").then(data => {
                        this.data = data.data.classicMovies;
                        // this.data.hot.forEach(e=>{
                        //       e.img = e.img.replace("w.h", "128.180"); //64*90
                        // })
                        // this.data.hot.sort((a, b) => {
                        //     if (a.sc == 0 || a.sc < b.sc) return 1
                        //     else return -1
                        // })

                        console.log("classicmovie:",JSON.parse(JSON.stringify(this.data)));
                    }).catch(error => console.log("获取数据失败!",error));
    }
}   
</script>

<style scoped>
 .classic_movie_main li{
   width: 100%;
   height: 3rem;
   padding: 10px 10px;
   background-color: white;
   box-sizing: border-box;
   display: flex;
 }

  .classic_movie_main li>img{
   width: 64px;
   height: 90px;
 }

 .classic_movie_main .gloden{
   font-size: .4rem;
   color: #faaf00;
 }

  .classic_movie_main .content{
    flex: 1 1 auto;
    padding-left: 10px;
  }

  .classic_movie_main .content p{
    word-spacing: normal;
    line-height: 0.6rem;
    font-size: .346667rem;
    color: #666;
    width: 5.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }


   .classic_movie_main .right_content{
     width: 1.333333rem;
     text-align: center;
   }

   .classic_movie_main h1{
       font-weight: bold;
       
       font-size: .453333rem;
   }
</style>